

import React, { FC, useEffect ,useState } from 'react'
import { useParams } from 'react-router-dom';
import { ajax } from './../../api/index';
import { Button, Row,Col,Card , Tag } from 'antd';
import { useNavigate } from 'react-router-dom';
import MyTitle from '../../components/Title';
import { baseURL } from '../../api/request';
import { roleList } from '../../utils';
import moment  from 'moment';
const {Meta} = Card 
const  AdviseDetail:FC<any>  = ()=> {
    const params = useParams()
    const [obj,setObj]  = useState<any>(null)
    const navigate = useNavigate()
    const getAdviseOne = async ()=>{
        let {code,result} = await ajax.getadviseone({
            _id:params.aid,
        })
        if(code==200){
            setObj(result )
        }
    }
    useEffect(()=>{
        getAdviseOne()
    },[])
    return (
        <div>
            
            <Button onClick={()=>navigate(-1)} danger >返回上一级</Button>
            <MyTitle text="意见详情"/>
            <Row style={{marginTop:15}}>
                <Col>
                    {
                        obj && <Card
                        hoverable
                        style={{ width: 240 }}
                        cover={<img alt="example" height={250} src={obj.info.avatar.replace(/public/,baseURL)} />}
                    >   

                        <Meta title={obj.info.username } description={obj.info.phone} />
                            <Tag color={  roleList.find((item:any)=>item.value==obj.info.role )?.color}> 
                                {roleList.find((item:any)=>item.value==obj.info.role)?.label}
                            </Tag>
                        <p>
                            {obj.title }
                        </p>
                        <div dangerouslySetInnerHTML={{__html:obj.content}}>

                        </div>
                        <p>
                            {obj.category}
                        </p>
                        <p>
                            {moment(obj.time).format("YYYY-MM-DD HH:mm:SS")}
                        </p>
                    </Card>
                    }
                </Col>
            </Row>
        </div>
    )
}

export default AdviseDetail